<template>
  <div class="conten-warp-meal">
    <cus-card>
      <div class="conten-warp-return">
          <Button
            type="error"
            
            @click="$router.go(-1)"
          >
            返回
          </Button>
      </div>
      <div class="conten-warp-title flex">
        <h2>{{ titleDates }}伙食费开支统计分析图</h2>
      </div>
      <div class="conten-warp-chartBox">
        <mealChart :id="this.$route.query.id" @titleDate="titleDate"></mealChart>
      </div>
    </cus-card>
  </div>
</template>

<script>
import mealChart from "./mealChart.vue";

export default {
  components: { mealChart },
  data() {
    return {
      form: {},
      titleDates: null,
    };
  },
  mounted() {
    console.log(this.$route.query.id)
   },
  methods: { 
    titleDate(v) {
      console.log(v)
      this.titleDates = v;
    }
  },
};
</script>
<style lang="less" scoped>
.conten-warp-chartBox {
  // height: 670px;
  height:calc(~'100vh - 270px');
  width: 100%;
  margin-top: 50px;
  // overflow: auto;
}
</style>